<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>
    const URL = 'http://img-ads.csdn.net/2018/201811150919211586.jpg';
    // 1. 创建连接
    var xhr = null;
    xhr = new XMLHttpRequest()
    // 2. 连接服务器
    xhr.open('get', URL, true);
    // 3. 发送请求
    xhr.send(null);
    // 4. 接受请求
    xhr.onreadystatechange = function () {
        switch(xhr.readyState){
            case 0: // 请求未初始化
                console.log(" 请求未初始化 ")
                break;
            case 1://OPENED
                console.log("OPENED")
                break;
            case 2://HEADERS_RECEIVED
                console.log("HEADERS_RECEIVED")
                break;
            case 3://LOADING
                console.log("LOADING")
                break;
            case 4://DONE
                if(this.status == 200||this.status == 304){
                    console.log(this.responseText);
                }
                console.log("DONE")
                break;
        }
    }

    xhr.ontimeout = function(e) { console.log('ontimeout') }
    xhr.onerror = function(e) { console.log('onerror') }

    /**
     * 4: 配置参数
     */
    xhr.timeout = 3000 // 设置 xhr 请求的超时时间
    xhr.responseType = "text" // 设置响应返回的数据格式
</script>
</body>
</html>